 
html,body{height: 100vh;width: 100vw;overflow: hidden;   user-select: none;
  box-sizing: border-box;} 
@size:10.805vh; 
.mr-10{
margin-right: .5rem;
}
.mr-20{
margin-right: 1rem;
}
.mr-30{
  margin-right: 1.5rem;
  }
  .mr-50{
    margin-right: 2.5rem;
    }
.mr-16{
margin-right: .8rem;
}
.mt-69{
  margin-top: (69/@size);
}
.mr-40{
margin-right: 2rem;
}
.mb-29{
  margin-bottom: (29/@size);
  }
.mb-30{
margin-bottom: (30/@size);
}
.mb-23{
  margin-bottom: (23/@size);
  }
.mt-50{
margin-top:(50/@size);
}
.mt-25{
  margin-top:(25/@size);
  }
  .mt-26{
    margin-top:(26/@size);
    }
.mt-29{
margin-top: (29/@size);
}
.b-3-19A5F9{
  border: 3px solid #1890FE;

}
.b-3-19A5F9{
  border: 3px solid #19A5F9;
}
.b-3-18B6F6{
  border: 3px solid #18B6F6;
}
.b-3-19C7F1{
  border: 3px solid #19C7F1;
}
.b-3-19E7EA{
  border: 3px solid #19E7EA;
}
.b-3-1AFFE5{
  border: 3px solid #1AFFE5;
}
.px-9{
  padding-left: .45rem;
  padding-right: .45rem;
}
.mt-26{
  margin-top: (26/@size);
  }
.mt-27{
  margin-top: (27/@size);
  }
.mt-31{
  margin-top: (31/@size);
  }
.mt-33{
  margin-top: (33/@size);
  }
  .mt-30{
    margin-top: (30/@size);
    }

.ml-50{
  margin-left: 2.5rem;
}

.ml-12{
margin-left: .6rem;
}
.select_box {
width: 5.5rem;
height: (30/@size); 
background: rgba(3, 20, 57, 0);
border: 0.1rem solid #00ceff; 
padding-left: .4rem;
.select_box_left{
  width:.35rem;
  height: (7/@size);
  margin-right: .15rem; 
  background: url('/image/num_xc/right_quan.png') no-repeat;
  background-size: 100% 100%;
}
.w-109{width: 5.5051vw;}
.h-47{height: (47/@size);}
.select_box_title{
  // width: 2.8rem;
  width: 100%;
  font-size: .6rem;
  font-family: Source Han Sans SC;
  font-weight: 400;
  color: #00CEFF
}
.select_box_right{
  width:1.55rem;
  height: (29/@size); 
  // margin-left: .95rem;
  background: url('/image/num_xc/right_select.png') no-repeat;
  background-size: 100% 100%;
}
} 
.boix-tab{
// width:29.5rem;  
// font-size: .7rem;
font-size: (14/@size);
  color: #ffffff;
font-family: Source Han Sans SC;
font-weight: 400;
.h-38{
    height: (38/@size);
}
.boix-tab_active{
 background-color: #042358;

}

}

.left_xzzc {
  font-size: .9rem;
  font-family: Source Han Sans SC;
  font-weight: 400;
  color: #ffffff;
  width: 24.25rem;

  height: (40/@size);
  background: url("/image/num_xc/left_xz_pay.png") no-repeat;
  background-size: 100% 100%;
}
.container{
  height: 100vh;width: 100vw; 
  // height: 100%;
  background: url("/image/num_xc/containerbg.png") no-repeat top center; 
  background-size: 100% 100%;
  position: relative;
  .top {
      // height: 4.4271vw;
      // height: 4.25rem;
      height: (85/@size);
      // position: relative;
      background: url("/image/num_xc/topbg.png") no-repeat;
      background-size: 100% 100%;
      text-align: center;
      line-height:  4.4271vw;
      font-size: 1.6rem;
      font-family: Source Han Sans SC;
      font-weight: bold;
      color: #ffffff;
      text-shadow: 0px 0px 12px #009eff;
      .top_right{ 
      
        // width:15rem;
         position: absolute;
         top: 0;
         right:0; 
          font-size: .9rem;
          font-family: SourceHanSansSC;
          font-weight: 400;
          color: #A5B6D3;
          margin-right: .9rem;

          img{
            width: 1.1rem;
            height: (23/@size);
          }
      }
    }

    .box {
      padding: 1.0417vw 1.0417vw  0; 
      display: flex;
      overflow: hidden;
      box-sizing: border-box;
      // padding: 2rem; 
      .box_left {
          overflow: hidden;
          box-sizing: border-box;
          padding: 2rem 1.75rem 0;
          width: 28.9063vw; 
          height: (955/@size); 
          background: url("/image/num_xc/left.png") no-repeat;
          background-size: 100% 100%;
         
          
         .xzpayout_tab{
          
          div{
             width: 4.9rem;
             height: (36/@size);
             width: 3.4rem;
            height: (30/@size);
             background: url("/image/num_xc/bsyq.png") no-repeat;
             background-size: 100% 100%;
             font-size: .8rem;
             font-family: Source Han Sans SC;
             font-weight: 400;
             color: #a5b6d3;
          }
          
          .bsyq_item_active {
           background: url("/image/num_xc/bsyq1.png") no-repeat;
           background-size: 100% 100%;
           color: #ffffff;
          }
          
         }
        .xzzc_top_e{
            margin-top: 1.5rem;
          //  height: (260/@size);
            height: (214/@size);
          //  width: 100%;
          //  border: 1px solid red; 
        }
        .xzzc_bottom_e{ 
          // margin-top: 3.2rem;
          // height: (323/@size);
         
          // border: 1px solid red;

          .xzzc_bottom_e_top{
          
            margin-left: 2.6263vw;
            margin-right:2.6263vw;
           
            .staijianc_noactive { 
              // box-sizing: border-box; 
              width:(71/@size);
              height: (71/@size);

              background: url("/image/num_xc/leftshengt.png") no-repeat;
              background-size: 100% 100%;
              font-size: .6rem;
              font-family: Source Han Sans SC;
              font-weight: 400;
              color: #a5b6d3;
              padding: .2525vw;
            }
            .staijianc_active{
              background: url("/image/num_xc/left_shengt1.png") no-repeat;
              background-size: 100% 100%;
            }
          }
         

        }
        .guoyuanzhic{
          height: (153/@size);
             width: 100%;
          // border: 1px solid red;

        }

        .shuiq{
          height: (275/@size);
             width: 100%;
          // border: 1px solid red;

        }
        .guoyuanhuanjjc{
          height: (151/@size);
             width: 100%;
          // border: 1px solid red;

        }
         
      }
      .box_center{ 
          // 宽度可以使用rem但是高度的话rem没适配的 
          width:38.0208vw;
          height: (955/@size); 
      
          .box_center_top {
              overflow: hidden;
              box-sizing: border-box;
            width: 36.5rem;
            height: (578/@size); 
            background: url("/image/num_xc/center_top.png") no-repeat;
            background-size: 100% 100%;
            padding: 6.2rem 1.5rem 0;
            .box_center_top_box{
                // width: 34.5rem;
                height: 16.6rem;
                // border: 1px solid red;
                .box_center_top_left {
                  width: 5.45rem;
                  height: (67/@size);
                  display: flex;
                  align-items: center;
                  justify-content: center;
                  background: url("/image/num_xc/bigbsyq.png") no-repeat;
                  background-size: 100% 100%;
                  font-size: .8rem;
                  font-family: Source Han Sans SC;
                  font-weight: 400;
                  color: #a5b6d3;
                  .num_active{
                    font-size: .9rem;
                    font-family: SourceHanSansSC;
                    font-weight: 400;
                    color: #FFFFFF;
                    text-shadow: 1px 0px 5px #ffffff;

                  }
                  .title_active{
                    font-size: .7rem;
                    font-family: SourceHanSansSC;
                    font-weight: 400;
                    color: #A5B6D3;
                  }

                }
                .box_center_top_left1 {
                  width: 5.45rem;
                  height: (67/@size);
                  display: flex;
                  align-items: center;
                  justify-content: center;
                  background: url("/image/num_xc/bigbsyq.png") no-repeat;
                  background-size: 100% 100%;
                  font-size: .8rem;
                  font-family: Source Han Sans SC;
                  font-weight: 400;
                  color: #a5b6d3;
                  

                }
                .box_center_top_left_active {
                  width: 5.45rem;
                  height: (67/@size);
                  display: flex;
                  align-items: center;
                  justify-content: center;
                  background: url("/image/num_xc/bigbsyq1.png") no-repeat;
                  background-size: 100% 100%;
                  font-size: .8rem;
                  font-family: Source Han Sans SC;
                  font-weight: 400;
                  color: #a5b6d3;
                  .num{
                    font-size: .9rem;
                    font-family: SourceHanSansSC;
                    font-weight: 400;
                    color: #FFFFFF;
                    text-shadow: 1px 0px 5px #ffffff;

                  }
                  .title{
                    font-size: .7rem;
                    font-family: SourceHanSansSC;
                    font-weight: 400;
                    color: #A5B6D3;
                  }

                }
            }
            .maps{
              width: 23.1771vw;
              height: (314/@size);
              // border: 1px solid red;
            }
          }

          .box_center_center{
              width: 36.5rem; 
              box-sizing: border-box;
              height: (281/@size); 
              color: #ffffff; 
              padding:  (20/@size) 1.5rem 0rem;
              background: url("/image/num_xc/center_bottom.png") no-repeat;
              background-size: 100% 100%; 
              
              .left_xzzc {
                font-size: .9rem;
                font-family: Source Han Sans SC;
                font-weight: 400;
                color: #ffffff;
                // width: 24.25rem; 
                width: 36.5rem; 
                margin-left:1rem ;
                margin-right:1rem ;

                height: (40/@size);
                
                background: url("/image/num_xc/left_xz_pay.png") no-repeat;
                background-size: 100% 100%;
               }
               .box_center_center_box{ 
                 
                .paim_title{
                  font-size: (14/@size);
                  font-family: SourceHanSansSC;
                  font-weight: 400;
                  color: #FFA13F;
                  margin-bottom: (7/@size);
                }
                 
                .yibiaoban1, .yibiaoban2, .yibiaoban3{
                  width: 4.5rem;
                  height: (114/@size);
                   
                  // background: linear-gradient(0deg, #FFA13F 0%, #1890FF 0%, rgba(3, 20, 57, 0) 100%);
                  
                  background: url("/image/num_xc/paim.png") no-repeat;
                  background-size: 100% 100%; 
                  

                }

                .boix-tab{
               
                  font-size: (14/@size);
                    color: #ffffff;
                  font-family: Source Han Sans SC;
                  font-weight: 400;
                  .h-38{
                      height: (34/@size);
                  }
                  .w-295{
                    width: 14.75rem;

                  }
                  .boix-tab_active{
                   background-color: #042358;
                  
                  }
                  
                  }
                  .bsyq {
                    width: 4.9rem;  
                    .bsyq_item1 { 
                      width: 7.9rem;
                      height: (44/@size); 
                      font-size: .8rem;
                      font-family: Source Han Sans SC;
                      font-weight: 400;
                      color: #ffffff;
                      margin-bottom: (17/@size);
                      background: url("/image/num_xc/bsyq.png") no-repeat;
                      background-size: 100% 100%;
                    }
                    .bsyq_item_active {
                      background: url("/image/num_xc/bsyq1.png") no-repeat;
                      background-size: 100% 100%;
                      color: #ffffff;
                    }
                    

                  }
                  .gyxsje{
                    width:19.899vw; 
                    height:(128/@size);
                    width: 22.899vw;
                     height: 14.846367vh;
                    // height: 100px;
                   
                  }
                  
                }
                .bsyq_right {
                  overflow: hidden;
                  box-sizing: border-box;
                  width: 5.2rem; 
                  height:(82/@size);
                  background: url("/image/num_xc/quezhenbg.png") no-repeat;
                  background-size: 100% 100%;
                  .bsyq_right_title {
                    font-size: .7rem;
                    font-family: Source Han Sans SC;
                    font-weight: 400;
                    color: #a5b6d3;
                  }
                  .bsyq_right_num {
                    font-size: 1.2rem;
                    font-family: Roboto;
                    font-weight: 500;
                  }

                }
          }
          
          .box_center_bottom_item { 
              width: 28.45rem;
              height: (46/@size);
              margin-top: (30/@size);
              .bottom_item_bg {
                // width: 6.9rem; 
                margin-right: 4.25rem;
              // border: 1px  solid #ffffff;
                width: 7.45rem;
                height: (46/@size);
                line-height: (36/@size);
                text-align: center;
                font-size: 0.8rem;  
              //   margin-right: 3.75rem;
                font-family: Source Han Sans SC;
                font-weight: 400;
                color: #a5b6d3;
                background: url("/image/num_xc/center_bottom (1).png") no-repeat;
                background-size: 100% 100%;
                color: #a5b6d3;
              }
              .box_center_bottom_item_active {
                background: url("/image/num_xc/center_bottom1.png") no-repeat;
                background-size: 100% 100%;
                color: #ffffff;
              }
            }
      }
      .box_right{
        overflow: hidden;
        box-sizing: border-box;
          // width: 28.9063vw;
          height: (955/@size);
          padding: 2rem 1.75rem 0; 
          background: url("/image/num_xc/left.png") no-repeat;
           background-size: 100% 100%;
          .box_right_tab{
          
           div{
              // width: 4.9rem;
              // height: (36/@size);
              width: 4.9rem;
              height: (47/@size);
              background: url("/image/num_xc/bsyq.png") no-repeat;
              background-size: 100% 100%;
              font-size: .8rem;
              font-family: Source Han Sans SC;
              font-weight: 400;
              color: #a5b6d3;
           }
           
           .bsyq_item_active {
            background: url("/image/num_xc/bsyq1.png") no-repeat;
            background-size: 100% 100%;
            color: #ffffff;
          }
           
          }
          .box_right_top{
               
              height: (282/@size);
              .box_right_top_quan{
                // border: 1px solid red; 
                  // width: 10.6rem;
                  width: 14.2424vw;
                  // height: (212/@size);
                  height: (282/@size);
                  // background: linear-gradient(0deg, #1890FF 0%, #1AFFE4 100%);
                  // border-radius: 50%;
              }
            
              .box_right_top_list{   
                  color: #A5B6D3;   
                  .box_right_top_list_active{
                    color: #f9d354; 
                    // width: .2rem;
                    // height: (30/@size);
                    border-right:4px solid  #1890FF; 
                     
                    border-radius: 2px;
                  }
                  .box_right_top_list_item{
                    margin-bottom: (13/@size); 
                  }
                  .border_id{
                    width: (11/@size);
                    height: (11/@size); 
                    border-radius: 50%; 
                  }
                  .yjtitle{
                    // border: 1px solid red;
                    width:4rem;
                    font-size: .7rem;
                    font-family: Source Han Sans SC;
                    font-weight: 400;
                    // color: #A5B6D3;
                  }
                  .yjicon{
                    width: 16px;
                    height: 18px;
                    background: url("/image/num_xc/yousanj.png") no-repeat;
                    background-size: 100% 100%;
                  }
                  .border_num{
                    font-size: .8rem;
                    font-family: Roboto;
                    font-weight: 500; 
                    margin-right: .55rem;
                  }
              }
            }
          
         
          
          // .swiper {
           
          //   // width: 800px;
          //     width: 18.75rem;
          //   border: 1px solid red;
          //   .swiper-wrapper{
          //     width: 18.75rem;
          //       height: .05rem;
          //       top: 50%; 
          //       background: linear-gradient(90deg, rgba(0, 206, 255, 0.1) 0%, #00CEFF 52%, rgba(0, 206, 255, 0.1) 100%);
          //       border-radius: 1px;
          //       border-radius: 0.05rem;
          //       position: relative;
          //     .swiper-slide { 
              
          //     }
          //   }
          // }
        
          .swiper {
            width: 18.75rem !important; 
            overflow: hidden;
            box-sizing: border-box;
             height: (40/@size); 
            // border: 1px solid red;
            margin: 0!important; ;
          }
          .line{
            // width: 18.75rem!important; ;
            width:30rem !important;
            height: .05rem!important;
            top:(14/@size); 
            background: linear-gradient(90deg, rgba(0, 206, 255, 0.1) 0%, #00CEFF 52%, rgba(0, 206, 255, 0.1) 100%);
            border-radius: 1px;
            border-radius: 0.05rem;
            position: relative;
            .swiper-slide{
              width: 1.4rem!important; ;            
              height: (30/@size);
              margin: 0px !important;
              margin-right:1.2rem!important; ;
              .jb_line_item_buj{
                position: absolute;
                  
                 margin-top: -(12/@size);
                 
                 width: 1.4rem;            
                 height: (30/@size);  
                 .jb_line_item_buj_img{ 
                  //  width: .65rem;
                  width:.9rem; 
                   height: (13/@size); 
                  background: url('/image/num_xc/quan1.png') no-repeat ;
                  background-size: 100% 100%;
                  margin-left: 25%; 
                 }
                 .jb_line_item_buj_img_active{
                  background: url('/image/num_xc/quan4.png') no-repeat ;
                  background-size: 100% 100%;
                 }
                
                 .jb_line_item_buj_title{
                  user-select: none;
                  //  margin-top: (5/@size);
                  width: 1.45rem;
                  height: (14/@size);
                  font-size: (10/@size);
                  font-family: Source Han Sans SC;
                  font-weight: 400;
                  color: #A5B6D3;
                 }
              }
             }
          }
          
          
         

          
        .bsyq_right {
          width: 5.2rem;
          // box-sizing: border-box;
          overflow: hidden;
          height:(70/@size);
          background: url("/image/num_xc/quezhenbg.png") no-repeat;
          background-size: 100% 100%;
          .bsyq_right_title {
            font-size: .7rem;
            font-family: Source Han Sans SC;
            font-weight: 400;
            color: #a5b6d3;
          }
          .bsyq_right_num {
            font-size: 1.2rem;
            font-family: Roboto;
            font-weight: 500;
          }
        }
        .ggecharts{
          width: 100%;
          height: (234/@size);
          // border: 1px solid red;
        }
       }
    }
}
